<template>
  <div>
    <v-dialog title="复核新增调整复核"
							:show.sync="dialogVisible"
							:destroy-on-close="true"
							@beforeClose="beforeClose"
							width="1200px">
      <div class="card-box">
        <div class="data-title" style="margin-left: 20px">基本信息</div>
        <el-form class="card-box">
          <div class="info-list mb20" style="font-size: 16px">
            <dl>
              <dt>关联合同</dt>
              <dd>{{form.propertyNames}}</dd>
            </dl>
            <dl>
              <dt>付款项目</dt>
              <dd>{{form.chargeProjectName}}</dd>
            </dl>
            <dl>
              <dt>出租方</dt>
              <dd>{{form.customerName}}</dd>
            </dl>
            <dl>
              <dt>合同应付金额(元)</dt>
              <dd>{{form.payableMoney}}</dd>
            </dl>
            <dl>
              <dt>本次调整金额(元)</dt>
              <dd>{{form.adjustmentAmount}}</dd>
            </dl>
            <dl>
              <dt>调整后金额(元)</dt>
              <dd>{{form.adjustedAmount}}</dd>
            </dl>
            <dl>
              <dt>费用周期</dt>
              <dd>{{form.costPeriodStart}}至{{form.costPeriodEnd}}</dd>
            </dl>
            <dl>
              <dt>应付日期</dt>
              <dd>{{form.payableDate}}</dd>
            </dl>
            <dl class="full">
              <dt>备注</dt>
              <dd>{{form.remarks}}</dd>
            </dl>
          </div>
        </el-form>
      </div>
      <div class="card-box">
        <div class="data-title" style="margin-left: 20px">查看附件</div>
        <div style="padding: 20px 20px">
          <upload-media
            type="file"
            ref="myUpload"
            :url="fileUploadUrl"
            :busId="projectId"
            :modelType="modelType"
            :propsFileList="uploadFileList"
            :isView="true"
          ></upload-media>
        </div>
      </div>
      <div class="card-box">
        <div class="data-title" style="margin-left: 20px">操作记录</div>
        <div style="padding: 20px 20px">
          <approval-record v-for="(item,index) in recordingLlist" :key="index" v-bind="item"></approval-record>
        </div>
      </div>
      <div class="card-box">
        <div class="data-title" style="margin-left: 20px">办理意见</div>
        <div class="handling-opinions">
          <el-input type="textarea" v-model="opinion" maxlength="100" placeholder="请输入" class="full"></el-input>
        </div>
      </div>
      <span slot="foot">
        <el-button @click="handleCancel">取 消</el-button>
        <el-button @click="commit">复核不通过并退回</el-button>
        <el-button v-throttle="[commitReview]">复核通过</el-button>
      </span>
    </v-dialog>
  </div>
</template>

<script>
import { ApproveByAdjustment, getApprovalRecord, getAdjustment, changeAdjustment, getObj } from '../../api/lessor-payable'
import uploadMedia from '@/components/upload-media'
import BaseLoad from '@/assets/vue-mixin/BaseLoad'
import approvalRecord from '@/components/approval-record'
export default {
  name: "review-payable",
  components: { uploadMedia, approvalRecord },
  mixins: [BaseLoad],
  data () {
    return {
      form: {
        chargeProjectName: '',
        propertyNames: '',
        costProjectName: '',
        payableMoney: '',
        costPeriodStart: '',
        costPeriodEnd: '',
        payableDate: '',
        remarks: '',
        opinion: '',
        payableStatus: '',
        adjustmentId: ''
      },
      data: {},
      opinion: '',
      dialogVisible: false,
      fileUploadUrl: '/admin/sys-file/upLodeFileEdit',
      uploadFileList: [],
      modelType: 'finance',
      projectId: '',
      recordingLlist: []
    }
  },
  methods: {
    async show (item) {
			this.loadAction('数据加载中，请稍等...')
      if (item) {
        this.projectId = item.adjustmentId
        await getAdjustment(item.adjustmentId).then(res => {
          if (res.data.code === 0) {
            this.form = res.data.data
          }
        })
        await getObj(item.payableId).then(res => {
          if (res.data.code === 0) {
            this.form.customerName = res.data.data.customerName
            this.form.payableDate = res.data.data.payableDate
            this.form.adjustedAmount = this.form.payableMoney + this.form.adjustmentAmount
          }
        })
				this.dialogVisible = true
				this.loadClose()
        this.approvalRecord(item.adjustmentId)
      }
    },
    beforeClose (done) {
      done()
			this.$emit('beforeClose')
    },
    handleCancel () {
      this.dialogVisible = false
			this.$emit('handleCancel')
    },
    commit () {
      if (this.opinion === '' || this.opinion === null || this.opinion === undefined) {
        this.$message.error('办理意见不能为空！')
      } else {
        this.data = {
          opinion: this.opinion,
          adjustmentId: this.form.adjustmentId,
          status: '2'
        }
        this.sendFormData(this.data)
      }
    },
    commitReview () {
      changeAdjustment(this.projectId).then(res => {
        if (res.data.code === 0) {
          this.data = {
            opinion: this.opinion ? this.opinion : '复核通过',
            adjustmentId: this.form.adjustmentId,
            status: '1'
          }
          this.sendFormData(this.data)
        } else {
          this.err(res.data.msg)
        }
      })
    },
    sendFormData (val) {
      this.loadAction('请稍等...')
      ApproveByAdjustment(val).then(resp => {
        if (resp.data.data) {
          this.suc('操作成功')
          this.dialogVisible = false
          this.loadClose()
          this.$emit('resetList')
        } else {
          this.err('操作失败')
          this.loadClose()
        }
      })
    },
    async approvalRecord (id) {
      const res = await getApprovalRecord(id)
      if (res.data.code == 0) {
        this.recordingLlist = res.data.data
      }
    }
  }
}
</script>

<style scoped lang="scss">
@include data-title();
.handling-opinions {
  padding: 20px;
  /deep/.el-textarea__inner {
    border: 0.5px solid #ccc;
  }
}
@include info-list(4);
@include formWrap(4);
</style>
